<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>当高度较小时，让文字垂直居中</title>
    <style>
        .div{font-size: 0;  vertical-align: middle;display: table;}
        .div p{line-height: 14px;display: inline;vertical-align: middle;}
        a{padding: 0 8px; border:solid 1px red; border-radius: 3px; display: inline-block;height: 14px;font-size: 0;}
        a span{vertical-align: middle; }
        span{display:inline-block;line-height: 12px; font-size: 12px; }
        .icon{display:inline-block;width:13px;height:11px;background: url("icons.png");  background-size: 216px 133px;  background-position: 0 -15px;  }
    </style>
</head>
<body>
<div style="padding: 15px;border: solid 1px #eee; ">
    <div class="div">
        <p style="font-size: 14px; ">是否退出:</p>
        <p style="height: 50px;padding: 15px;">
            <a style="margin-right: 10px;"><span class="icon"></span><span>确认</span></a>
            <a><span class="icon"></span><span>取消</span></a>
        </p>
    </div>
</div>
</body>
</html>